<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="utf-8"/>
    <title>班次维护</title>
    <meta name="renderer" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <link rel="stylesheet" href="/lib/layui-v2.5.4/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all"/>
    <link rel="stylesheet" href="/css/public.css" media="all"/>
    <style>
        html, body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        .layuimini-main {
            margin: 0px 10px 10px 0px;
        }

        .layui-card-header {
            background-color: #cbddf3;
            padding: 5px;
            font-size: 14px;
            border: 1px solid #99bce8;
            box-shadow: #f3f7fb 0 1px 0px 0 inset;
            height: 20px;
            line-height: 20px;
        }

        .layui-table-tool {
            padding: 0px 5px;
            background-color: #d3e1f1;
            color: #0C0C0C;
            height: 36px !important;
            min-height: 32px !important;
            line-height: 32px;
            border-style: solid;
            border-color: #99bce8;
            border-width: 1px;
        }

        .layui-card-body {
            padding: 0 !important;
            margin: 0 !important;
            border-color: #99bce8;
            border-width: 1px;
            border-style: solid;
            background: #fff;
        }

        .layui-table-tool-temp {
            padding-right: 0px !important;
        }

        .layui-table-tool-temp .layui-btn, .layui-table-tool .layui-btn {
            border-color: #99bce8 !important;
            border-width: 1px !important;
            border-style: solid !important;
        }

        .layui-card-table {
            padding: 0 !important;
            margin: 0 !important;
        }

        .layui-table-view, .layui-table {
            margin: 0 !important;
        }

        .icon {
            margin-right: 10px;
            color: #1aa094;
        }

        .layui-table td, .layui-table th {
            position: relative;
            padding: 5px 10px;
            min-height: 20px;
            line-height: 20px;
            font-size: 14px;
            color: #0C0C0C;
        }

        .layui-table-view .layui-table[lay-size=sm] th .layui-table-cell {
            line-height: 30px;
            height: 30px;
            font-weight: bold;
            font-size: 12px;
        !important:;
        }

        .layui-table-view .layui-table td, .layui-table-view .layui-table th {
            padding: 0;
            border-top: none;
            border-left: none;
        }

        .search-header {
            height: 30px;
            margin: 0;
            padding: 0 5px;
            border-style: solid;
            border-color: #99bce8;
            border-width: 1px;
            background-color: #d3e1f1;
        }

        .search-input {
            vertical-align: middle;
            width: 120px;
            display: inline-block;
            height: 30px;
            font-size: 14px;
            border-color: #99bce8 !important;
            border-width: 1px !important;
            border-style: solid !important;
        }

        .layui-btn-search {
            background-color: #d3e1f1;
            color: #0C0C0C;
        }

    </style>
</head>
<body>
<div class="layuimini-container" style="height:calc(100%)">
    <div class="layuimini-main">
        <div class="layui-row layui-col-space3">
            <div class="layui-col-xs12 layui-col-sm4 layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <i class="fa fa-warning icon"></i>组织机构
                    </div>
                    <!--                    <div class="layui-form layui-border-box layui-table-view">-->
                    <!--                        <div class="search-header layui-table-tool">-->
                    <!--                            <div class="layui-table-tool-temp">-->
                    <!--                                <div class="layui-btn-group" style="display: inline-block">-->
                    <!--                                    <input class="layui-input search-input" type="text" id="inputCode"  placeholder="关键词搜索" autocomplete="off" ></input>-->
                    <!--                                    <button class="layui-btn layui-btn-sm layui-btn-primary tableSelect_btn_search" id="search"  >-->
                    <!--                                        <i class="layui-icon layui-icon-search"></i>-->
                    <!--                                    </button>-->
                    <!--                                </div>-->
                    <!--                            </div>-->
                    <!--                        </div>-->
                    <!--                    </div>-->
                    <div class="layui-card-body">
                        <table id="organizationTable" lay-filter="organizationTable"></table>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm8 layui-col-md9">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <i class="fa fa-warning icon"></i>班次类型
                    </div>

                    <div class="layui-card-body" style="height: auto">
                        <table id="shiftTimeTable" lay-filter="shiftTimeTable"></table>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>

<div hidden="hidden" id="saveBdsCodeTableUi">
    <form class="layui-form" action="" lay-filter="saveBdsCodeTableForm" id="saveBdsCodeTableForm">
        <div style="padding-right: 20px">
            <div class="layui-form-item" style="margin-top:20px ">
                <label class="layui-form-label required">名称:</label>
                <div class="layui-input-block">
                    <input type="text" name="typeName" lay-verify="required" lay-reqtext="名称不能为空" value=""
                           class="layui-input"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">标准代码:</label>
                <div class="layui-input-block">
                    <input type="text" name="standardCode" lay-verify="required" lay-reqtext="标准代码不能为空" value=""
                           class="layui-input"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label ">排序:</label>
                <div class="layui-input-block">
                    <input type="number" name="itemIndex" value="" class="layui-input"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label ">标准版本:</label>
                <div class="layui-input-block">
                    <input type="text" name="standardVersion" value="" class="layui-input"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label ">来源:</label>
                <div class="layui-input-block">
                    <input type="number" name="source" value="" class="layui-input"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label ">备注:</label>
                <div class="layui-input-block">
                    <textarea name="descn" class="layui-textarea"></textarea>
                </div>
            </div>
            <input type="text" name="id" hidden></input>
        </div>
        <div style="padding-top: 5px;padding-bottom: 20px;">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-normal layui-btn-sm" lay-submit lay-filter="saveBtn">确认</button>
                <button class="layui-btn layui-btn-primary layui-btn-sm" type="reset">重置</button>
            </div>
        </div>
    </form>
</div>


<div hidden="hidden" id="shiftTimeCodeTableUi">
    <table class="layui-table" id="shiftTimeCodeTable"></table>
</div>
<script type="text/html" id="searchToolbar">
    <div class="layui-btn-group" style="display: inline-block">
        <input class="layui-input search-input" type="text" name="inputCode" placeholder="关键词搜索"
               autocomplete="off"></input>
        <button class="layui-btn layui-btn-sm layui-btn-primary tableSelect_btn_search" lay-event="search">
            <i class="layui-icon layui-icon-search"></i>
        </button>
    </div>
</script>
<script type="text/html" id="toolbar">
    <div class="layui-btn-group" style="display: inline-block">
        <input class="layui-input search-input" type="text" name="inputCode" placeholder="关键词搜索"
               autocomplete="off"></input>
        <button class="layui-btn layui-btn-sm layui-btn-primary tableSelect_btn_search" lay-event="search">
            <i class="layui-icon layui-icon-search"></i>
        </button>
    </div>
    <div class="layui-btn-group">
        <button class="layui-btn layui-btn-sm data-refresh-btn layui-btn-primary" lay-event="refresh"><i
                class="layui-icon layui-icon-refresh"></i></button>
        <button class="layui-btn layui-btn-sm layui-btn-primary" lay-event="add"><i
                class="layui-icon layui-icon-add-1"></i></button>
        <button class="layui-btn layui-btn-sm layui-btn-primary" lay-event="update"><i
                class="layui-icon layui-icon-edit"></i></button>
        <button class="layui-btn layui-btn-sm layui-btn-primary data-delete-btn" lay-event="delete"><i
                class="layui-icon layui-icon-delete"></i></button>
    </div>
</script>

<script src="/lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="/js/pinyin.js"></script>
<script>

    layui.use(['element', 'table', 'form'], function () {
        var $ = layui.jquery,
            element = layui.element,
            table = layui.table,
            form = layui.form
        ;

        let checkRow = new Map();
        let layerOpenIndex;
        var size = {
            width: window.innerWidth || document.body.clientWidth,
            height: window.innerHeight || document.body.clientHeight
        }

//单击行勾选checkbox事件
        $(document).on("click", ".layui-table-body table.layui-table tbody tr", function () {
            /*当单击表格行时,把单选按钮设为选中状态*/
            var tableDiv;
            var index = $(this).attr('data-index');
            var tableBox = $(this).parents('.layui-table-box');
            //存在固定列
            if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length > 0) {
                tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l");
            } else {
                tableDiv = tableBox.find(".layui-table-body.layui-table-main");
            }
            var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
            if (checkCell.length > 0) {
                checkCell.click();
            }
        });

        //对td的单击事件进行拦截停止，防止事件冒泡再次触发上述的单击事件
        $(document).on("click", "td div.laytable-cell-checkbox div.layui-form-checkbox", function (e) {
            e.stopPropagation();
        });
        $(function () {
            loadCodeTable();
            loadCodeTableItem();
        })

        table.render({
            elem: "#shiftTimeCodeTable",
            method: "get",
            url: "/bds/getBdsCodeTableItem",
            height: 'full-200',
            where: {
                tId: 385475
            },
            cols: [ [
                {type: "checkbox", fixed: "left"},
                {field: "itemName", title: "班次名称"},
                {field: "itemValue", title: "班次编码"}
            ]],
            size: 'sm',
            skin: 'line',
            even: true
        });

        function loadCodeTable() {
            //方法渲染：
            table.render({
                elem: '#organizationTable',
                id: 'organizationTable',
                method: 'GET',
                url: '/bds/getBdsOrganizationByKeyWords',
                toolbar: '#searchToolbar',
                defaultToolbar: [],
                cols: [ [
                    {type: 'numbers', fixed: 'left'},
                    {field: 'name', title: '名称'},
                    {field: 'code', title: '编码', hide: (size.width < 500)},
                    {field: 'property1', title: '院区', hide: (size.width < 500)},
                    {field: 'id', title: '主键ID', hide: true},
                    {field: 'pinyinCode', title: '拼音码', hide: true},
                    {field: 'wubiCode', title: '五笔码', hide: true},
                ] ],
                size: 'sm',   //尺寸
                skin: 'line',  //line （行边框风格）  row （列边框风格） nob （无边框风格)
                height: 'full-80',
                even: true,  //隔行背景
                done: function () {
                    $("#organizationTable").siblings("div").find("input[name='inputCode']").bind('keypress', function (event) {
                        if (event.keyCode == 13) {
                            $("#organizationTable").siblings("div").find("input[name='inputCode']").next().click();
                        }
                    });
                }
            });
        }

        function loadCodeTableItem() {
            console.info(size);
            //方法渲染：
            table.render({
                elem: '#shiftTimeTable',
                id: 'shiftTimeTable',
                method: 'GET',
                url: '/pts/getShiftTimeByOrgCode',
                toolbar: '#toolbar',
                defaultToolbar: [],
                cols: [ [
                    {type: 'checkbox', fixed: 'left'},
                    {field: 'timeCodeName', title: '名称', sort: true},
                    {field: 'timeCode', title: '值', sort: true},
                    {field: 'startDate', title: '开始时间', sort: true},
                    {field: 'endDate', title: '结束时间', sort: true},
                    {field: 'id', title: 'ID', sort: true, hide: true},
                    {field: 'note', title: '备注', edit: 'text'}
                ] ],
                size: 'sm',   //尺寸
                skin: 'line',  //line （行边框风格）  row （列边框风格） nob （无边框风格)
                height: 'full-90',
                even: true,  //隔行背景
                done: function (obj) {
                    $("#shiftTimeTable").siblings("div").find("input[name='inputCode']").bind('keypress', function (event) {
                        if (event.keyCode == 13) {
                            $("#shiftTimeTable").siblings("div").find("input[name='inputCode']").next().click();
                        }
                    });
                }
            });
        }

        //监听行单击事件
        table.on('row(organizationTable)', function (obj) {
            rowObj = obj.data;
            $(obj.tr).parent().children('.layui-table-click').removeClass('layui-table-click');
            obj.tr.addClass('layui-table-click');
            checkRow.set('organizationTable', obj);
            //执行搜索重载
            table.reload('shiftTimeTable', {
                where: {
                    orgCode: obj.data.code
                }
            });
        });

        window.enabledTableItem = function (obj, index) {
            // obj.isenabled = index ;
            $.ajax({
                url: '/bds/enabledTableItem',
                method: 'post',
                data: {
                    id: obj,
                    isenabled: index
                },
                success: function (obj1) {
                    table.reload('codeTableItem');
                }
            });
        }

        // 头部工具栏点击事件
        table.on('toolbar(organizationTable)', function (obj) {
            switch (obj.event) {
                case 'search':
                    let keyWords = $("#organizationTable").siblings("div").find("input[name='inputCode']").val();
                    table.reload('organizationTable', {
                        where: {
                            keyWords: keyWords
                        }
                    });
                    checkRow.set('organizationTable', null);
                    $("#organizationTable").siblings("div").find("input[name='inputCode']").val(keyWords);
                    break;
            }
        });


        function addShiftTime(title) {
            let rowObj = null;
            if (checkRow.get('organizationTable')) {
                rowObj = checkRow.get('organizationTable').data;
            }
            if (rowObj) {
                layer.open({
                    type: 1,
                    title: title,
                    content: $("#shiftTimeCodeTableUi"),
                    moveOut: true,
                    move: true,
                    area: '460px',
                    success: function () {
                        table.reload('shiftTimeCodeTable');
                    },
                    btn: ['确定', '取消'],
                    yes: function (index, layero) {
                        let sampleArray = table.checkStatus('shiftTimeCodeTable').data;
                        let result = sampleArray.map(item => {
                            return {
                                timeCode: item.itemValue,
                                orgCode: rowObj.code
                            }
                        })
                        layer.close(index);
                        addShiftTimeRequest(result);
                    }
                });
            } else {
                layer.alert('请先选择组织机构', {
                    icon: 2
                })
            }
        }


        function addShiftTimeRequest(obj) {
            var index = layer.msg('服务器处理中...', {
                icon: 16
                , shade: 0.08,
                time: 0
            });
            // console.info(JSON.stringify(obj));
            $.ajax({
                url: "/pts/saveShiftTime",
                type: "POST",
                data: {
                    shiftTimeArray: JSON.stringify(obj)
                },
                success: function (obj) {
                    layer.close(index);
                    table.reload('shiftTimeTable');
                }
            });
        }

        // 头部工具栏点击事件
        table.on('toolbar(shiftTimeTable)', function (obj) {
            switch (obj.event) {
                case 'refresh':
                    table.reload('shiftTimeTable', {
                        keyWords: ''
                    });
                    break;
                case 'add':
                    addShiftTime('添加班次');
                    break;
                case 'delete':
                    layer.alert('删除班次' + JSON.stringify(checkRow.get('organizationTable').data));
                    break;
            }
        });

        function openSaveCodeTableUi(title) {
            layerOpenIndex = layer.open({
                type: 1,
                title: title,
                skin: 'layui-layer-lan',
                content: $("#saveBdsCodeTableUi")
            });
        }

        function openSaveCodeTableItemUi(title) {
            layerOpenIndex = layer.open({
                type: 1,
                title: title,
                skin: 'layui-layer-lan',
                content: $("#saveBdsCodeTableItemUi")
            });
        }

        form.on('submit(saveBdsCodeTableForm)', function () {
            var index = layer.msg('服务器处理中...', {
                icon: 16
                , shade: 0.08,
                time: 0
            });
            let obj = form.val('saveBdsCodeTableForm');
            if (!obj.spellCode) {
                obj.spellCode = makePy(obj.typeName);
            }
            $.ajax({
                url: "/bds/saveBdsCodeTable",
                type: "POST",
                data: obj,
                success: function (obj) {
                    layer.close(index);
                    if (obj.code == '0') {
                        layer.msg("保存成功！", {icon: 6, time: 3000})
                        table.reload('codeTable');
                    }
                }
            });
            layer.close(layerOpenIndex);
            return false;
        })

        form.on('submit(saveBdsCodeTableItemForm)', function () {
            var index = layer.msg('服务器处理中...', {
                icon: 16
                , shade: 0.08,
                time: 0
            });
            $.ajax({
                url: "/bds/saveBdsCodeTableItem",
                type: "POST",
                data: form.val('saveBdsCodeTableItemForm'),
                success: function (obj) {
                    layer.close(index);
                    if (obj.code == '0') {
                        layer.msg("保存成功！", {icon: 6, time: 3000})
                        table.reload('codeTableItem');
                    }
                }
            });
            layer.close(layerOpenIndex);
            return false;
        })

        //生成拼音码 五笔码
        $("#itemName").on("change", function (e) {
            $('#spellCode').val(makePy(e.target.value));
            $('#wbCode').val(makeWb(e.target.value));
        });
    });
</script>

</body>
</html>
